<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>实时语音转写</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
</head>
<body>
<table align="center">
    <tr align="center">
        <td colspan="4">实时语音转写</td>
    </tr>
    <tr>
        <td colspan="4"><textarea id="text" style="width: 100%;height: 200px;"></textarea></td>
    </tr>
    <tr>
        <td width="16"><img src="img/speech.png" width="16" height="16"></td>
        <td width="300" align="left"><span id="say">正在说话...</span></td>
        <td width="20"><input id="start" type="button" value="录音"/></td>
        <td width="20"><input id="stop" type="button" value="停止"/></td>
    </tr>
</table>
<script src="js/asr_streaming_grpc_web_pb2.js"></script>
<script src="js/crypto-js.js"></script>
<script type="text/javascript">
    const SpeechRecognitionGrpc = function () {
        const hostName = "stream-asr-prod.yitutech.com:50051";
        const devId = "21501";
        const devKey = "NGE3ZTQ3MDBjNmU5NDhhZTgyMDJmMjNjOTI4NzhlY2U=";
        const sampleRate = 16000;
        this.getMetaData = function () {
            const timestamp = parseInt(new Date().getTime() / 1000);
            const signature = CryptoJS.enc.Hex.stringify(CryptoJS.HmacSHA256(devId + timestamp, devKey));
            const metaData = {
                'x-dev-id': devId
                , 'x-request-send-timestamp': timestamp
                , 'x-signature': signature
                , 'x-api-key': devId + ',' + timestamp + ',' + signature
            };
            return metaData;
        };
        this.getStreamingSpeechConfig = function () {
            const speechConfig = new proto.SpeechConfig();
            speechConfig.setLang(proto.SpeechConfig.Language.MANDARIN);
            speechConfig.setScene(proto.SpeechConfig.Scene.GENERALSCENE);
            const audioConfig = new proto.AudioConfig();
            audioConfig.setAue(proto.AudioConfig.AudioEncoding.PCM);
            audioConfig.setSamplerate(sampleRate);
            const streamingSpeechConfig = new proto.StreamingSpeechConfig();
            streamingSpeechConfig.setSpeechconfig(speechConfig);
            streamingSpeechConfig.setAudioconfig(audioConfig);
            return streamingSpeechConfig;
        };
        this.recognizeStream = function () {
            const request = new proto.StreamingSpeechRequest();
            request.setStreamingspeechconfig(this.getStreamingSpeechConfig());
            const metaData = this.getMetaData();
            console.log(metaData);
            SpeechRecognitionClient(hostName, metaData, {});
        }
    }
    const stub = new SpeechRecognitionGrpc();
    stub.recognizeStream();
</script>
</body>
</html>


